<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>黑名单</title>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/frame.css">
    <link rel="stylesheet" href="../css/addClass.css">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
    <div class="frame-header"><span class="page-reload cur">黑名单管理</span></div>
    <!--操作栏-->
    <div class="operates clearfix" style="overflow: auto;white-space: nowrap; font-size: 0;">
        
        <div class="right-btns" style="font-size: 0">
            <button class="btn delete pramary" onclick="fun(1)">批量移出</button>
            <button class="btn delete pramary" onclick="fun(2)">批量发送</button>

        </div>
    </div>
    <!--表格-->
    <div class="table-wrapper pl27 " style="min-width: 1000px;">
        <table class="table text-center">
            <thead>
                <tr>
                    <th style="width: 2%;" class="yt">
                       <input type="checkbox" class="allCheck" id="allCheck" name="allCheck" onclick="selectAll()">
                       <label for="all">&nbsp;&nbsp;&nbsp;</label>
                    </th>
                    <th style="width: 4%;" class="sort cur">序列
                        <img class="bottom" src="../img/jt-bottom.png" alt="">
                        <img class="top" style="display: none" src="../img/jt-right-co.png" alt="">
                    </th>
                    <th class="sort cur" style="width:6%">用户id
                        <img class="bottom" src="../img/jt-bottom.png" alt="">
                        <img class="top" style="display: none" src="../img/jt-right-co.png" alt="">
                    </th>
                    <th class="sort cur" style="width: 4%;">姓名
                        <img class="bottom" src="../img/jt-bottom.png" alt="">
                        <img class="top" style="display: none" src="../img/jt-right-co.png" alt="">
                    </th>
                    <th class="sort cur" style="width: 4%;">身份证号
                        <img class="bottom" src="../img/jt-bottom.png" alt="">
                        <img class="top" style="display: none" src="../img/jt-right-co.png" alt="">
                    </th>
                    <th class="no-nowrap sort cur" style="width: 4%;">电话
                        <img class="bottom" src="../img/jt-bottom.png" alt="">
                        <img class="top" style="display: none" src="../img/jt-right-co.png" alt="">
                    </th>
                    <th class="no-nowrap sort cur" style="width: 8%;">操作
                        <img class="bottom" src="../img/jt-bottom.png" alt="">
                        <img class="top" style="display: none" src="../img/jt-right-co.png" alt="">
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr th:each="list:${lists}">
                    <td>
                        <input type="checkbox" name="id" id="${list.id}" th:value="${list.id}"> 
                        <label for="ph1"></label>
                    </td>
                    <td>
                        <p th:text="${list.id}"></p>
                    </td>
                    <td>
                        <p th:text="${list.id}">000 001</p>
                    </td>
                    <td>
                        <p th:text="${list.realname}">苏浙汇(南京西路店)</p>
                    </td>
                    <td>
                        <p th:text="${list.idcardnumber}">zhangxiaoer</p>
                    </td>
                    <td>
                        <p th:text="${list.phone}">zhang</p>
                    </td>
                    <td>
                        <a href ="javascript:void(0);" th:onclick="addToBlackList([[${list.id}]])">移出黑名单</a>
                        &nbsp;&nbsp;&nbsp;
                        <a href ="javascript:void(0);" th:onclick="sendMessage([[${list.id}]])">发送短信</a>
                    </td>

                </tr>

            </tbody>
        </table>
    </div>
      <div class="table-tel clearfix">
        <div style="border-bottom: 1px solid #fff; overflow: hidden;" class="no-hover">
            
            
            <div class="tab-margin clearfix " style="width: 400px; position: absolute; left: 50%; margin-left: -120px;">
                <div class="fl tb3" style="width: 250px;float: left;">
                    <div class="page-wrapper text-left" th:if="${page.currectPage == page.startPage}">
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.currectPage - 1})}" class="btn-s"><img src="../img/left-icon.png" alt=""></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.startPage})}" class="active"><span th:text="${page.startPage}">1</span></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.startPage + 1})}" class=""><span th:text="${page.startPage + 1}">2</span></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.endPage})}" class=""><span th:text="${page.endPage}">3</span></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.currectPage + 1})}" class="btn-s"><img src="../img/right-icon.png" alt=""></a>
                    </div>
                    <div class="page-wrapper text-left" th:if="${page.currectPage == page.startPage + 1}">
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.currectPage - 1})}" class="btn-s"><img src="../img/left-icon.png" alt=""></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.startPage})}" class=""><span th:text="${page.startPage}">1</span></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.startPage + 1})}" class="active"><span th:text="${page.startPage + 1}">2</span></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.endPage})}" class=""><span th:text="${page.endPage}">3</span></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.currectPage + 1})}" class="btn-s"><img src="../img/right-icon.png" alt=""></a>
                    </div>
                    <div class="page-wrapper text-left" th:if="${page.currectPage == page.endPage}">
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.currectPage - 1})}" class="btn-s"><img src="../img/left-icon.png" alt=""></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.startPage})}" class=""><span th:text="${page.startPage}">1</span></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.startPage + 1})}" class=""><span th:text="${page.startPage + 1}">2</span></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.endPage})}" class="active"><span th:text="${page.endPage}">3</span></a>
                        <a th:href ="@{/queryBlacklist.do(currectPage=${page.currectPage + 1})}" class="btn-s"><img src="../img/right-icon.png" alt=""></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<span th:replace="common/links-tpl::common-links-tpl"></span>
<script type="text/javascript" src="/js/plugin/jquery.twbsPagination.min.js"></script>
<script type="text/javascript" src="/js/plugins-override.js"></script>
<script type="text/javascript" src="/js/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="/js/plugin/jquery.form.js"></script>
<script type="text/javascript" th:inline="javascript">
	
	/* 批量处理的全选与全不选操作 */
	function selectAll(){
		//id=all是全选/反选的checkbox，判断是选中还是没选中
		var isChecked=$("#allCheck").is(':checked');
		//获取所有checkbox组成的数组
		var checkedArrs=$("input[type='checkbox']:checked");
		//判断是全选还是反选
		if(isChecked){
			$("input[type='checkbox']").each(function(){
				$(this).prop('checked',true);
			});
		}else{
			$("input[type='checkbox']").each(function(){
				$(this).prop('checked',false);
			});
		}
	}
	
	/* 获取check中被选中的值  */
	 function fun(ch){
	    obj = document.getElementsByName("id");
	    check_val = [];
	    for(k in obj){
	        if(obj[k].checked)
	            check_val.push(obj[k].value);
	    }
	    location.href = "/opBlackList.do?id=" + check_val + "&op=" + ch;
	}                   
	
	 function addToBlackList(idcard){
		  $.ajax({
		        url:"/addToBlackListByUserId.do",	
		        type:"post",
		        dataType: "json",	
		        data:{userid:idcard,op:0},
				success: function(rs){
				//最后将数据返回到这里，通过js显示在页面
					if(rs.success == true){
						alert(idcard + "用户以被成功移出黑名单");
					}else{
						alert(idcard + "移出黑名单失败," + rs.message);
					}
				}
		    })
	  }
	 
	 function sendMessage(userid){
		  $.ajax({
		        url:"/SendMessageList.do",	
		        type:"post",
		        dataType: "json",	
		        data:{userid:userid,send:"你好，你已经被纳入本行黑名单，请本人及时到银行消除黑名单"},
				success: function(rs){
				//最后将数据返回到这里，通过js显示在页面
					if(rs.success == true){
						alert("短信成功发送");
					}else{
						alert("短信发送失败," + rs.message);
					}
				}
		    })
	  }

</script>

</html>